<template>
  <div style="" class="journal">
    <div>
      <span class="title">Api错误日志</span>
      <div>

      </div>


      <el-table
        :data="tableData"
        style="width: 100%">
        <el-table-column
          prop="createTime"
          label="登录时间">
        </el-table-column>
        <el-table-column
          prop="createBy"
          label="操作人">
        </el-table-column>
        <el-table-column
          prop="remoteIp"
          label="登录IP">
        </el-table-column>
        <el-table-column
          prop="title"
          label="操作内容">
        </el-table-column>
      </el-table>
      <el-pagination
        v-if="total > 0"
        style="margin-top: 10px"
        class="fixed"
        align="right"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="pageNo"
        :page-sizes="[10, 20, 30, 50]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
    import {journalList} from '@/api/user'
    export default {
        name: "journal",
        data() {
            return {
                tableData: [],
                pageNo: 1,
                pageSize: 10,
                total: 0
            }
        },
        created() {
            this.init()
        },
        methods: {
            init(){
                journalList(this.pageNo, this.pageSize).then(res => {
                    if(res.data.success) {
                        this.tableData = res.data.data.records
                        this.total = res.data.data.total
                    }
                })
            },
            handleSizeChange(size) {
                this.pageSize = size
                this.init()
            },
            handleCurrentChange(page) {
                this.pageNo = page
                this.init()
            },
        }
    }
</script>

<style scoped lang="scss">
  .title{
    color: #435B77;
    font-weight: 600;
    font-size: 18px;
    display: inline-block;
    margin-bottom: 10px;
    padding-left: 10px;
  }
  .journal{
    background-color: white;
    font-size: 13px;
    padding: 15px;
    margin-bottom: 35px;
  }
</style>
